<template>
    <div id="virtualLab" class="flex-center">
        <iframe ref="iframe" :src="vlSrc" frameborder="0" class="v-l-container" width="100%" height="100%"></iframe>
    </div>
</template>

<script>
import mixin from '../../mixin/mixin'
import { Ini } from '../../../content/utils/ini';
export default {
    name: 'VirtualLab',
    mixins: [mixin],
    data() {
        return {
            vlSrc: '',
        }
    },
    mounted() {
        let eduLevel = Ini.readIni('data', 'eduLevel')
        this.vlSrc = `http://127.0.0.1:${eduLevel === 'primary' ? '38001' : '38002'}/${this.bsr.meta_info.meta_type}/${this.bsr.meta_info.meta_id}/build/index.html`
        this.$nextTick(() => {
            let dom = this.$refs.iframe.contentWindow.document.documentElement
            dom.style.width = '100%'
            dom.style.height = '100vh'
            dom.style.background="#fff"
            dom.style.display = 'flex'
            dom.style.alignItems = 'center'

        })
    },
    methods: {

    },
}
</script>

<style lang="scss">
#virtualLab {
    width: 100vw;
    height: calc(100vh - 30px);
}
</style>